<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>
			::-webkit-scrollbar {
				display: none;
			}

			html,
			body {
				height: 100%;
			}

			.el-container,
			.el-main {
				overflow-y: scroll;
				scrollbar-color: transparent transparent;
				scrollbar-track-color: transparent;
				height: 100%;
			}

			.el-header {
				background: #fff url("/header.png");
				color: #fff;
				text-align: center;
				font-size: 25px;
				line-height: 60px;
				border-radius: 5px;
			}
			#_title{
				font-family: "YouYuan";
				font-size: 32px;
				color: white;
				margin-left: 120px;
			}
			#_menu{
				font-size: 14px;
				background: #fff url("/leftmenu.png");
				text-color:#fcfcfc;
				border-radius: 15px;
			}
			#_aside{

			}
			.menu-item-title{
				font-size: 18px;
				font-family: "YouYuan";
				color: white;
			}
			.menu-item{
				font-size: 14px;
				text-align: left;
			}
			.menu-item-newTitle{
				font-size: 14px;
				color: #31b0d5;
			}
		</style>
		<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.15.13/lib/theme-chalk/index.min.css" />
		<script src="https://cdn.jsdelivr.net/npm/jquery@2.2.4/dist/jquery.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.min.js"></script>
		<script src="https://cdn.jsdelivr.net/npm/element-ui@2.15.13/lib/index.min.js"></script>
	</head>
	<body>
		<el-container id="app">
			<!-- 标题栏 -->
			<el-header  height="70px">
				<el-row>
					<el-col :span="20" :offset="2">
						<el-link id="_title" href="http://localhost:8081/homev.html" target="_blank">青鸟餐饮后台系统</el-link>
					</el-col>

					<el-col :span="2">
						<el-dropdown @command="headCommand">
							<span style="font-size:25px;color:#fff;cursor:pointer;">
								<i class="el-icon-user-solid"></i>
							</span>
							<el-dropdown-menu slot="dropdown">
								<el-dropdown-item v-if="!currentUserName" style="font-size:18px;" command="login">登录</el-dropdown-item>
								<el-dropdown-item v-if="!currentUserName" style="font-size:18px;" command="register">注册</el-dropdown-item>
								<el-dropdown-item v-if="currentUserName" style="font-size:18px;" command="logout" >注销</el-dropdown-item>
							</el-dropdown-menu>
						</el-dropdown>
					</el-col>
				</el-row>
			</el-header>
			<el-container style="margin-top: 15px;">
				<!-- 左侧导航 -->
				<div id="_aside">
					<el-aside width="220px">
						<el-menu id="_menu" unique-opened="true">
							<el-submenu index="1">
								<template slot="title">
									<span class="menu-item-title">商家中心</span>
								</template>
								<el-menu-item class="menu-item" @click="openWork('businessDetail.html');">商家信息</el-menu-item>
								<el-menu-item class="menu-item" @click="openWork('updatePassword.html');">修改密码</el-menu-item>
<!--								<el-menu-item class="menu-item" @click="openWork('work3.html');">更新信息</el-menu-item>-->
							</el-submenu>
							<el-submenu index="2">
								<template slot="title">
									<span class="menu-item-title">店铺管理</span>
								</template>
								<el-menu-item class="menu-item" @click="openWork('addShop.html');">新增店铺</el-menu-item>
								<el-menu-item class="menu-item" @click="openWork('Myshop.html');">我的店铺</el-menu-item>
<!--								<el-menu-item class="menu-item" @click="openWork('work3.html');">子模块C</el-menu-item>-->
							</el-submenu>
							<el-submenu index="3">
								<template slot="title">
									<span class="menu-item-title">订单管理</span>
								</template>
								<el-submenu index="3-1" class="menu-item" @click="openWork('waitOrder.html');">
									<template slot="title">
										<span class="menu-item-newTitle">等待商家接单</span>
									</template>
									<template v-for="shop in shopList">
											<el-menu-item index="3-1-{{shop.id}}" class="menu-item" @click=toWaitOrderById(shop.id)>{{shop.name}}</el-menu-item>
										</template>
								</el-submenu>

								<el-submenu index="3-2" class="menu-item" @click="openWork('outOrder.html');">
									<template slot="title">
										<span class="menu-item-newTitle">已接单</span>
									</template>
									<template v-for="shop in shopList">
											<el-menu-item index="3-2-{{shop.id}}" class="menu-item" @click=toOutOrderById(shop.id)>{{shop.name}}</el-menu-item>
										</template>
								</el-submenu>

								<el-submenu index="3-3" class="menu-item" @click="openWork('order.html');">
									<template slot="title">
										<span class="menu-item-newTitle">全部订单</span>
									</template>
									<template v-for="shop in shopList">
											<el-menu-item index="3-3-{{shop.id}}" class="menu-item" @click=toOrderById(shop.id)>{{shop.name}}</el-menu-item>
										</template>
								</el-submenu>

								<el-submenu index="3-4" class="menu-item">
									<template slot="title">
										<span class="menu-item-newTitle">回复评论</span>
									</template>
									<template v-for="shop in shopList">
										<el-menu-item index="3-4-{{shop.id}}" class="menu-item"
													  @click=toReplyById(shop.id)>{{shop.name}}
										</el-menu-item>
									</template>
								</el-submenu>
							</el-submenu>
							<el-submenu index="4">
								<template slot="title">
									<span class="menu-item-title">产品管理</span>
								</template>
								<el-menu-item class="menu-item" @click="openWork('addProduct.html');">新增产品</el-menu-item>
								<el-submenu index="4-2" class="menu-item">
									<template slot="title">
										<span class="menu-item-newTitle">修改产品</span>
									</template>
									<template v-for="shop in shopList">
										<el-menu-item index="3-4-{{shop.id}}" class="menu-item"
													  @click=toProductById(shop.id)>{{shop.name}}
										</el-menu-item>
									</template>
								</el-submenu>
							</el-submenu>

						</el-menu>
					</el-aside>
				</div>

				<!-- 工作区 -->
				<el-main v-html="work" style="margin-top:-10px;margin-right:-20px;overflow: hidden"></el-main>
			</el-container>
		</el-container>
		<script>
			let app = new Vue({
				el: "#app",
				data: {
					work: "<iframe frameborder=0 width=100% height=100% src='dataPanel.html'></iframe>",
					currentUserName:"",
					currentId:'',
					status:'',
					shopList:''
				},
				methods: {
					//openWork
					openWork: function(work) {
						this.work = "<iframe frameborder=0 width=100% height=100% src='" + work + "'></iframe>";
					}
					,
					initCurrentUserName(){
						let vueObj = this;
						$.get("/business/currentUserName",function (d) {
							console.log(d)
							vueObj.currentUserName=d.name;
							vueObj.currentId=d.id;
							let param = {businessId:vueObj.currentId}
							$.post("/shop/shopList",param,function (data){
								vueObj.shopList=data;
							});
						});
					}
					,
					headCommand(command){
						if(command==="logout"){
						$.get("business/logout",function (d) {
							location.href="/homev"

						})
						}
						else if (command==="login"){
							$.get("toLogin",function (d) {
								location.href=d
							})
						}else if(command==="register"){
							$.get("toRegister",function (d) {
								location.href=d
							})
						}
					}
					,
					orderStatus(status){
						alert(status)
						app.openWork("/order/test?status="+status)
					}
					,
					toProductById(shopId){
						let id = JSON.stringify(shopId);
						localStorage.setItem("shopId",id);
						app.openWork("/myProducts.html?shopId="+shopId)
					}
					,
					toReplyById(shopId){
						let id = JSON.stringify(shopId);
						localStorage.setItem("shopId",id);
						app.openWork("/reply.html?shopId="+shopId)

					}
					,
					toOrderById(shopId){
						let id = JSON.stringify(shopId);
						localStorage.setItem("shopId",id);
						app.openWork("/order.html?shopId="+shopId)
					}
					,
					toOutOrderById(shopId){
						let id = JSON.stringify(shopId);
						localStorage.setItem("shopId",id);
						app.openWork("/outOrder.html?shopId="+shopId)
					}
					,
					toWaitOrderById(shopId){
						let id = JSON.stringify(shopId);
						localStorage.setItem("shopId",id);
						app.openWork("/waitOrder.html?shopId="+shopId)
					}

				}
				,
				//vue生命周期中调用
				created(){
					this.initCurrentUserName();
				}
			});
		</script>
	</body>
</html>
